<template>
  <div class="wrapper">
    <div>
      <Header></Header>
    </div>
    <!-- 使用 router-view 组件，并使用 v-slot 语法获取当前路由组件 -->
    <router-view v-slot="{ Component }">
      <!-- 动态渲染当前路由对应的组件 -->
      <component :is="Component" />
    </router-view>
  </div>
</template>

<script setup lang="ts">
import Header from "./views/landing-page/my-header.vue";

</script>

<style>
/**
 * 在这个样式标签中，可以编写组件的 CSS 样式。
 * 可以使用 scoped 属性使样式仅在当前组件中生效，避免全局样式污染。
 * 此处为空，表示该组件没有额外的样式代码。
 */
.wrapper {
  background-image: url("./assets/背景一.png");
  background-size: cover;
  background-repeat: no-repeat;
}

body {
  font-family: "Source Sans Pro", sans-serif;
}
</style>
